<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="vue.global.js"></script>
</head>
<body>
    <div id="app">
      <input type="text" v-model="message">
      <br>
        {{ message }}
        <!-- <div v-show="message === 'bbb'">v-show</div>
        <div v-for="(item,index) in dataList" key="index">{{item.name}}----{{item.sex}}</div> -->
      </div>

</body> 
<script>
  /* v-model
   * v-show
   * v-for
   * v-text->缩略写法{{}} 二者都存在的话，只会绑定展示一个值，不会重复显示
   **/
        const App = {
      data() {
        return {
          message: '呵呵',
          // dataList:[{
          //   name: '张三',
          //   sex: '男'
          // },
          // {
          //   name: '李四',
          //   sex: '女'

          // }]

        }
      }
    }

    Vue.createApp(App).mount('#app')
  
</script>
</html>